<!-- 
 * 严肃声明：
 * 开源版本请务必保留此注释头信息，若删除我方将保留所有法律责任追究！
 * 可正常分享和学习源码，不得用于违法犯罪活动，违者必究！
 * Copyright (c) 2022 APThink David唐 all rights reserved.
 * 版权所有，侵权必究！
 *
 -->
<script setup lang="ts">
import { ref } from 'vue'
import { i18n } from '@/i18n'
import { appStore } from '@/stores/app'
import { login, getUser } from '@/api'
import { toast } from '@/utils'
import router from '@/router'

const app = appStore()

const loginname = ref('')
const password = ref('')
function onClickLogin() {
  login(loginname.value, password.value).then((d: any) => {
    //David: 必须第一时间设置，避免后续访问服务报错（会话过期或不存在）
    app.login(d)
    toast(i18n.global.t('message.loginok'))
    getUser().then(d => {
      const p: any = router.currentRoute.value.query.redirect
      if (p && p.indexOf('/login') < 0 && p.indexOf('/nofound') < 0) {
        router.push(p);
      } else {
        router.push('/home');
      }
    })
  })
}

function onClickReset() {
  loginname.value = ''
  password.value = ''
}
</script>

<template>
  <div id="home" ref="root">
    <h3>{{ $t('dialog.login') }}</h3>
    <el-form label-position="right" label-width="100px" style="max-width: 300px">
      <el-form-item :label="$t('label.account')">
        <el-input v-model="loginname" :placeholder="$t('label.demoaccount')" />
      </el-form-item>
      <el-form-item :label="$t('label.password')">
        <el-input
          v-model="password"
          show-password
          :placeholder="$t('label.demopassword')"
          type="password"
        />
      </el-form-item>
    </el-form>
    <el-button type="primary" @click.prevent="onClickLogin">{{ $t('button.login') }}</el-button>
    <el-button @click.prevent="onClickReset">{{ $t('button.reset') }}</el-button>
  </div>
</template>
